import React, { Component } from 'react'
import { Button, Drawer, Alert, Upload, Icon, Divider, Row, Modal, Tabs, Badge, Form, Col, Input } from 'antd';
import { BasicLayout, BasicLayoutSearch } from './BasicLayout';
import { BasicPagination, compareNum, compareDate, compareString, TableCustomize, openSuccessModal, openModalMessage, isInvalidObject } from '../../../components/TableCustomize';
import SearchForm from './SearchForm';
import SearchForm1 from './SearchForm1';
import { getDate, getDateYYYYMM, getDateHHMMYY_HHMMSS } from '../../../utils/action';
import * as ProduceMange from '../../../axios/ProduceMange'
import { withRouter } from 'react-router';
import { withPermission } from '../../../components/withpermission'
const DownLoadButton = withPermission(Button, 'download')
const { TabPane } = Tabs
const FormItem = Form.Item;

class MaterialAccept extends Component {
    state = {
        dataSource: [
        ],
        paging: {},
        loading: false,
        some: null,
        selectedRows: [],
        advanced: false,
        values: {},
        selectedRowKeys: [],
        selectedRowKeys11: [],
        selectedRows11: [],
        tabsKey: '1',   //页面key
        merge: 0,
        record: null,
        columns: [
            {
                title: '序号',
                dataIndex: 'number',
                width: 50,
                align: 'center',
                render: (text, record, index) =>
                    <div>
                        {index + 1}
                    </div>
            },
            {
                title: '主领料单号',
                dataIndex: 'acceptCode',
                sorter: (a, b) => compareString(a.acceptCode, b.acceptCode),
                width: 150,
            },

            {
                title: '批号',
                width: 100,
                dataIndex: 'batchNo',
                sorter: (a, b) => compareString(a.batchNo, b.batchNo),
            },
            {
                title: '机型',
                width: 160,
                dataIndex: 'model',
                sorter: (a, b) => compareString(a.model, b.model),
            },
            {
                title: '领料车间',
                width: 100,
                dataIndex: 'departmentName',
                sorter: (a, b) => compareString(a.departmentName, b.departmentName),
            },
            {
                title: '领料班组',
                width: 100,
                dataIndex: 'groupName',
                sorter: (a, b) => compareString(a.groupName, b.groupName),
            },
            {
                title: '班组长',
                width: 80,
                sorter: (a, b) => compareString(a.groupLeader, b.groupLeader),
                dataIndex: 'groupLeader',
            },
            {
                title: '领料项',
                width: 80,
                dataIndex: 'acceptItem',
                sorter: (a, b) => compareString(a.acceptItem, b.acceptItem),
            },
            {
                title: '申请时间',
                width: 150,
                dataIndex: 'acceptTime',
                sorter: (a, b) => compareDate(a.acceptTime, b.acceptTime),
                editable: true,
            },
            {
                title: '装配开始时间',
                width: 150,
                dataIndex: 'assembleStartTime',
                sorter: (a, b) => compareDate(a.assembleStartTime, b.assembleStartTime),
                editable: true,
            },
            {
                title: '需求时间',
                width: 150,
                dataIndex: 'requestTime',
                sorter: (a, b) => compareDate(a.requestTime, b.requestTime),
                editable: true,
            },
            // {
            //     title: '操作',
            //     dataIndex: 'opts',
            //     width: 100,
            //     render:
            //         (text, record) =>
            //             <div>
            //                 <a onClick={this.particular.bind(this, record)}>详细</a>
            //             </div>
            // },
            { dataIndex: '' }
        ],
        columnsInterior: [
            {
                title: '序号',
                dataIndex: 'number1',
                width: 50,
                align: 'center',
                render: (text, record, index) =>
                    <div>
                        {index + 1}
                    </div>
            },
            {
                title: '发料仓库编码',
                dataIndex: 'storeCode',
                sorter: (a, b) => compareString(a.storeCode, b.storeCode),
                width: 130,
            },

            {
                title: '发料仓库名称',
                width: 130,
                dataIndex: 'storeName',
                sorter: (a, b) => compareString(a.storeName, b.storeName),
            },
            {
                title: '仓库发料批次',
                width: 130,
                dataIndex: 'batchNum',
                sorter: (a, b) => compareNum(a.batchNum, b.batchNum),
            },
            {
                title: '发料项',
                width: 80,
                dataIndex: 'grantItem',
            },
            {
                title: '发料时间',
                width: 150,
                dataIndex: 'grantTime',
            },
            {
                title: '创建人',
                width: 100,
                dataIndex: 'createName',
            },
            {
                title: '发料状态',
                width: 100,
                dataIndex: 'states',
                render: (text, record) =>
                    <div>
                        {
                            text === 0 ? <Badge status="processing" text='待接收' /> : text === 1 ? <Badge status="success" text='已接收' /> : text === 2 ? <Badge status="warning" text='接收中' /> : text === 3 ? <Badge status="error" text='收料异常' /> : null
                        }
                    </div>,
                sorter: (a, b) => compareString(a.states, b.states),
            },
            {
                title: '接收时间',
                width: 150,
                dataIndex: 'receiveTime',
            },
            {
                title: '接收人',
                width: 100,
                dataIndex: 'receiveName',
            },
            { dataIndex: '' }
        ],
        columnsInterior1: [
            {
                title: '序号',
                dataIndex: 'number11',
                width: 50,
                align: 'center',
                render: (text, record, index) =>
                    <div>
                        {index + 1}
                    </div>
            },
            {
                title: '领料单号详细',
                dataIndex: 'acceptCodeDetail',
                width: 250,
                sorter: (a, b) => compareString(a.acceptCodeDetail, b.acceptCodeDetail),
            },

            {
                title: '物料编码',
                width: 100,
                dataIndex: 'partCode',
                render: (text, record) =>
                    <div>
                        {
                            record.partChangeAttitude === 1 ? <Badge status="success" text='新增' /> : record.partChangeAttitude === 2 ? <Badge status="error" text='取消' /> : record.partChangeAttitude === 3 ? <Badge status="warning" text='属性变化' /> : record.partChangeAttitude === 4 ? <Badge status="default" text='回仓' /> : null
                        }
                    </div>,
                sorter: (a, b) => compareString(a.partCode, b.partCode),
            },
            {
                title: '图号',
                width: 150,
                dataIndex: 'paperCode',
                sorter: (a, b) => compareString(a.paperCode, b.paperCode),
            },
            {
                title: '部件',
                width: 100,
                dataIndex: 'component',
            },
            {
                title: '物料名称',
                width: 130,
                dataIndex: 'partName',
            },
            {
                title: '物料规格',
                width: 100,
                dataIndex: 'partSpec',
            },
            {
                title: '批次发料数量',
                width: 130,
                dataIndex: 'handoverNumber',
                sorter: (a, b) => compareNum(a.handoverNumber, b.handoverNumber),
                render: (text, record) =>
                    <div>
                        {text}{record.receiveNumber ? `/${record.receiveNumber}` : ''}
                    </div>
            },
            {
                title: '已发总量',
                width: 100,
                dataIndex: 'grantTotal',
                sorter: (a, b) => compareNum(a.grantTotal, b.grantTotal)
            },
            {
                title: '需求总量',
                width: 100,
                dataIndex: 'requestNumber',
                sorter: (a, b) => compareNum(a.requestNumber, b.requestNumber)
            },
            {
                title: '操作',
                width: 100,
                dataIndex: 'open',
                render: (text, record, index) =>
                    <div>
                        {
                            record.states === 0 ? <a onClick={this.receive.bind(this, record, index)}>接收</a> : record.states === 1 ? '已接收' : record.states === 2 ? '接收中' : record.states === 3 ? '收料异常' : null
                        }
                    </div>
            },
            { dataIndex: '' }
        ],
        dataSourceInterior: [
        ],
        dataSourceInterior1: [
        ],
        row: [],
        // 打印数据
        columns1: [
            {
                title: '序号',
                dataIndex: 'number',
                width: 60,
                ellipsis: true,
                render: (text, record, index) =>
                    <div>
                        {index + 1}
                    </div>
            },
            {
                title: '机型',
                dataIndex: 'model',
                ellipsis: true,
                width: 100,
            },

            {
                title: '批号',
                width: 100,
                dataIndex: 'batchNo',
                ellipsis: true,
            },
            {
                title: '装配机号',
                width: 80,
                dataIndex: 'assemblyNo',
                ellipsis: true,
            },
            {
                title: '台量',
                width: 60,
                dataIndex: 'stage',
                ellipsis: true,
            },
            {
                title: '装配部门',
                width: 80,
                dataIndex: 'assemblyDept',
                ellipsis: true,
            },
            {
                title: '资料输出时间',
                width: 100,
                dataIndex: 'dataOutputTime',
                ellipsis: true,
            },
            {
                title: '装配开始时间',
                width: 100,
                dataIndex: 'assemblyStartTime',
                ellipsis: true,
            },
            {
                title: '第一交机时间',
                width: 100,
                dataIndex: 'firstDeliveryTime',
                ellipsis: true,
            },
            {
                title: '试机/补漆/包装结束时间',
                width: 100,
                dataIndex: 'endTime',
                ellipsis: true,
            },
            {
                title: '第一出机时间',
                width: 100,
                dataIndex: 'firstExitTime',
                ellipsis: true,
            },
            {
                title: '备注',
                width: 120,
                dataIndex: 'remark',
                ellipsis: true,
            },
            {
                title: '创建人',
                width: 60,
                dataIndex: 'creater',
                ellipsis: true,
            },
            {
                title: '创建时间',
                width: 100,
                dataIndex: 'createTime',
                ellipsis: true
            }
        ],
        selectedRowKeys1: [],
        selectedRows1: [],
        advanced1: false,  //计划变更记录高级查询
        versions: null,
        values1: {},
        search1: [],  //请求数据
        paging1: {},
        rowSelections: [],

        buttonList: [],
        visible: false
    };
    UNSAFE_componentWillMount() {
        this.fetch()
        // this.fetch1()  //计划变更记录
    }
    componentWillUnmount() {
        this.setState = () => {
            return;
        };
    }
    //初始化加载数据
    fetch = (pageNum = 1, pageSize = 100) => {
        const { values } = this.state
        const buttonList = JSON.parse(localStorage.getItem('buttonList'))
        console.log('这是按钮', buttonList);
        if (buttonList ? buttonList.length !== 0 : null) {
            this.setState({
                buttonList
            })
        }
        this.setState({
            loading: true,
            // 操作后清除选中
            selectedRowKeys: [],
            selectedRows: [],
            // 展开其它项关闭详细table
            selectedRowKeys1: [],
            selectedRows1: [],
            // 清空详细选中
            selectedRows11: [],
            selectedRowKeys11: [],
            paging: { pageNum: pageNum, pageSize: pageSize }
        }, () => {
            this.search(values, { pageNum: pageNum, pageSize: pageSize })
        })
    }
    // 计划版本管理初始化加载数据
    fetch1 = (pageNum = 1, pageSize = 10) => {
        // const { values1, paging1 } = this.state
        // this.setState({
        //     paging1: { pageNum: pageNum, pageSize: pageSize }
        // }, () => {
        //     // console.log('有没有', values1);
        //     this.search1({ ...values1, ...paging1 })
        // })

    }
    // 查询接口
    search = (value, paging) => {
        ProduceMange.materialHandover({ ...value, ...paging }).then((item) => {
            if (item.data.code === 200) {
                this.setState({
                    loading: false,
                    dataSource: item.data.data,
                    // 操作后清除选中
                    selectedRowKeys: [],
                    selectedRows: [],
                    // 展开其它项关闭详细table
                    selectedRowKeys1: [],
                    selectedRows1: [],
                    // 清空详细选中
                    selectedRows11: [],
                    selectedRowKeys11: [],
                    some: null,
                    paging: {
                        pageNum: item.data.pageNum,
                        pageSize: item.data.pageSize,
                        total: item.data.total,
                    }
                })
            } else {
                openModalMessage('error', item.data.msg)
            }
        })
    }
    // 展开接口
    materialHandoverDetail = async (data) => {
        await ProduceMange.materialHandoverDetail(data).then(res => {
            if (res.data.code !== 200) {
                openModalMessage('warning', res.data.msg)
                return
            }
            this.setState({
                dataSourceInterior: res && res.data ? res.data.data : [],
                loading: false
            })
        })
    }
    // 点击行详细查询接口
    materialHandoverAcceptDetail = async (data) => {
        await ProduceMange.materialHandoverAcceptDetail(data).then((res) => {
            if (res.data.code !== 200) {
                openModalMessage('warning', res.data.msg)
                return
            }
            this.setState({
                dataSourceInterior1: res.data.data
            })

        })
    }
    //计划变更记录查询接口
    search1 = (pagings) => {
        // ProduceMange.queryPlanMonthChange(pagings).then((item) => {
        //     // console.log('计划管理页查询接口', item);
        //     if (item.data.code === 200) {
        //         this.setState({
        //             search1: [
        //                 { dataSource: item.data.data.data },
        //                 {
        //                     pageNum: item.data.data.pageNum,
        //                     pageSize: item.data.data.pageSize,
        //                     total: item.data.data.total,
        //                 }
        //             ]
        //         }, () => { console.log(this.state.search1); })
        //     } else {
        //         openModalMessage('error', item.data.msg)
        //     }
        // })
    }

    //查询
    handleSearch = value => {
        let receiveStartTime = null
        let receiveEndTime = null
        if (value.receiveEndTime && value.receiveEndTime.length === 2) {
            console.log(value.receiveEndTime);
            receiveStartTime = getDateHHMMYY_HHMMSS(value.receiveEndTime[0]._d)
            receiveEndTime = getDateHHMMYY_HHMMSS(value.receiveEndTime[1]._d)
        }
        // console.log({ ...value, receiveStartTime, receiveEndTime });
        const { paging } = this.state
        let a = { pageNum: paging.pageNum, pageSize: paging.pageSize }
        let versions = { ...value, receiveStartTime, receiveEndTime }
        this.setState({
            values: versions
        })
        this.search(versions, a)
    };
    //计划变更记录查询
    handleSearch1 = value => {
        // const { paging1 } = this.state
        // let changeTime = ''
        // let a = { pageNum: paging1.pageNum, pageSize: paging1.pageSize }
        // if (value.changeTime !== null && value.changeTime !== undefined) {
        //     changeTime = getDate(value.changeTime._d)
        // }
        // let versions = { ...value, changeTime }
        // this.setState({
        //     values1: versions
        // })
        // this.search1({ ...versions, ...a })
    };
    // 接收(内)
    receive = (record, index) => {
        this.setState({
            record: record,
            visible: true
        })
    }
    // 详细
    // particular = (record, e) => {
    //     e.stopPropagation()
    //     console.log('详细', record, e);
    // }
    // 导出
    allStop = () => {
        // var printInnerHTML = window.document.getElementById('prints').innerHTML;
        // window.document.body.innerHTML = printInnerHTML
        // window.print()
        // window.location.reload()
        let userId = Number(localStorage.getItem('userId'))
        ProduceMange.handoverPrint({ userId }).then(res => {
            //设置下载文件类型为xlsx 不同的类型type也不一样，创建URL对象
            let url = window.URL.createObjectURL(new Blob([res.data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' }))
            // 创建A标签
            let link = document.createElement('a')
            link.style.display = 'none'
            link.href = url
            // 设置的下载文件文件名
            const fileName = decodeURI('物料接收-实收');
            // 触发点击方法
            link.setAttribute('download', fileName)
            document.body.appendChild(link)
            link.click()
        })
    }
    // 导出批次详情
    derive = () => {
        const { selectedRows1 } = this.state
        let arr = ''
        selectedRows1.forEach((value, index) => {
            arr = `id=${value.detailId}`
        })
        ProduceMange.exportBatchNumDesc(arr).then(res => {
            //设置下载文件类型为xlsx 不同的类型type也不一样，创建URL对象
            let url = window.URL.createObjectURL(new Blob([res.data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' }))
            // 创建A标签
            let link = document.createElement('a')
            link.style.display = 'none'
            link.href = url
            // 设置的下载文件文件名
            const fileName = decodeURI('领料单接收详细数据');
            // 触发点击方法
            link.setAttribute('download', fileName)
            document.body.appendChild(link)
            link.click()
        })
    }
    // 导出选中
    derive2 = () => {
        // const { selectedRows, some } = this.state
        // if (some > 0 && some !== null && some !== 0) {
        //     ProduceMange.exportExcel111(selectedRows).then((res) => {
        //         //设置下载文件类型为xlsx 不同的类型type也不一样，创建URL对象
        //         let url = window.URL.createObjectURL(new Blob([res.data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' }))
        //         // 创建A标签
        //         let link = document.createElement('a')
        //         link.style.display = 'none'
        //         link.href = url
        //         // 设置的下载文件文件名
        //         const fileName = decodeURI('月计划管理');
        //         // 触发点击方法
        //         link.setAttribute('download', fileName)
        //         document.body.appendChild(link)
        //         link.click()
        //     })
        // } else {
        //     openModalMessage('error', '请选中导出项')
        // }
    }
    // 导出选中-计划变更页
    derive3 = () => {
        // const { rowSelections } = this.state
        // let some = rowSelections[0]
        // let data = rowSelections[1]
        // if (some > 0 && some !== null && some !== 0) {
        //     ProduceMange.exportChangeReport(data).then((res) => {
        //         //设置下载文件类型为xlsx 不同的类型type也不一样，创建URL对象
        //         let url = window.URL.createObjectURL(new Blob([res.data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' }))
        //         // 创建A标签
        //         let link = document.createElement('a')
        //         link.style.display = 'none'
        //         link.href = url
        //         // 设置的下载文件文件名
        //         const fileName = decodeURI('月计划-变跟记录');
        //         // 触发点击方法
        //         link.setAttribute('download', fileName)
        //         document.body.appendChild(link)
        //         link.click()
        //     })
        // } else {
        //     openModalMessage('error', '请选中导出项')
        // }
    }
    // 重置
    cz = () => {
        this.setState({
            values: null
        }, () => { this.fetch() })
    }
    // 重置-计划变更记录
    cz1 = () => {
        this.setState({
            values1: {}
        }, () => {
            this.fetch1()
        })

    }
    // 高级查询
    advancedss = () => {
        this.setState({ advanced: !this.state.advanced })
    }
    //计划变更记录高级查询
    advancedss1 = () => {
        this.setState({ advanced1: !this.state.advanced1 })
    }
    // 展开方法
    onExpand = (expanded, record) => {
        this.setState({
            loading: true
        })
        // const { row } = this.state
        // let id = row.length > 0 ? row[0] : null
        // if (id == record.id) {
        //     expanded = false
        // }
        if (expanded) {
            this.materialHandoverDetail(record)
            this.setState({
                row: [record.id],
                expandedData: record,
                // 展开其它项关闭详细table
                selectedRowKeys1: [],
                selectedRows1: [],
                // 清空详细选中
                selectedRows11: [],
                selectedRowKeys11: [],
            })
        } else {
            this.setState({
                row: [],
                // 展开其它项关闭详细table
                selectedRowKeys1: [],
                selectedRows1: [],
                // 清空详细选中
                selectedRows11: [],
                selectedRowKeys11: [],
                loading: false
            })
        }
    }
    // 选择某一行数据(外)
    // 选中(外)
    pitch = (record) => {
        let flag = true;
        let index = 0;
        this.state.selectedRowKeys.forEach((row, i) => {
            if (row === record.id) {
                flag = false;
                index = i;
            }
        })
        const selectedRowKeys = this.state.selectedRowKeys;
        const selectedRows = this.state.selectedRows;
        if (flag) {
            selectedRowKeys.push(record.id);
            selectedRows.push(record);
        } else {
            selectedRowKeys.splice(index, 1);
            selectedRows.splice(index, 1);
        }
        this.setState({ selectedRowKeys: selectedRowKeys, selectedRows: selectedRows });
    }
    // 选中(内)
    pitch1 = (record) => {
        const { merge } = this.state
        let data = `&id=${record.detailId}&isMerge=${merge}`
        this.setState({
            pitch1Record: record
        })
        let selectedRowKeys = [record.detailId];
        let selectedRows = [record];
        this.materialHandoverAcceptDetail(data)
        this.setState({ selectedRowKeys1: selectedRowKeys, selectedRows1: selectedRows });
    }
    //接收确认
    onHandleOk = () => {
        const { form: { validateFields } } = this.props
        validateFields((err, value) => {
            if (err) return;
            const { expandedData, merge, pitch1Record, record } = this.state
            let datas = `&id=${pitch1Record.detailId}&isMerge=${merge}`
            let data = {
                id: record.id,
                takeNumber: value.takeNumber,
                userId: Number(localStorage.getItem('userId'))
            }
            console.log(data);
            ProduceMange.updateAcceptDetail(data).then((value) => {
                if (value.data.code !== 200) {
                    openModalMessage('warning', value.data.msg)
                    return
                }
                console.log(value);
                this.handleCancel()
                this.materialHandoverDetail(expandedData)
                this.materialHandoverAcceptDetail(datas)
                this.fetch()

            })
        })

    }
    handleCancel = () => {
        const { form: { resetFields } } = this.props
        resetFields();
        this.setState({
            visible: false,
            record: null
        })
    }
    // // 选中(详细)
    // pitch2 = (record) => {
    //     let flag = true;
    //     let index = 0;
    //     this.state.selectedRowKeys11.forEach((row, i) => {
    //         if (row === record.id) {
    //             flag = false;
    //             index = i;
    //         }
    //     })
    //     const selectedRowKeys = this.state.selectedRowKeys11;
    //     const selectedRows = this.state.selectedRows11;
    //     if (flag) {
    //         selectedRowKeys.push(record.id);
    //         selectedRows.push(record);
    //     } else {
    //         selectedRowKeys.splice(index, 1);
    //         selectedRows.splice(index, 1);
    //     }
    //     this.setState({ selectedRowKeys11: selectedRowKeys, selectedRows11: selectedRows });
    // }
    // 相同物料合并展示
    merge = () => {
        console.log('相同物料合并展示');
    }
    render() {
        const { visible, selectedRowKeys11, dataSourceInterior1, columnsInterior1, selectedRows1, selectedRowKeys1, columns, columns1, values1, selectedRows, search1, versions, tabsKey, selectedRowKeys, advanced, advanced1, some, one, paging, loading, dataSource } = this.state;
        const { form: { getFieldDecorator } } = this.props
        const rowSelection = {
            columnWidth: 60,
            type: 'checkbox',
            selectedRowKeys: selectedRowKeys,
            onChange: (selectedRowKeys, selectedRows) => {
                let some = [...selectedRows].length
                this.setState({
                    some: some,
                    selectedRows: selectedRows,
                    selectedRowKeys: selectedRowKeys
                }, () => {
                    console.log('选中个数', this.state.some, '选中详细数据', this.state.selectedRows);
                })
            },
            onSelectAll: (selected, selectedRows, changeRows) => {
                const keys = [... this.state.selectedRowKeys];
                const rows = [... this.state.selectedRows];
                if (selected) {
                    changeRows.forEach(row => {
                        if (isInvalidObject(keys.find(key => key === row.id))) {
                            keys.push(row.id);
                            rows.push(row);
                        }
                    })
                } else {
                    changeRows.forEach(row => {
                        keys.splice(keys.indexOf(row.id), 1);
                        rows.splice(rows.indexOf(row), 1);
                    })
                }
                this.setState({ selectedRows: rows, selectedRowKeys: keys })
            }
        }
        const rowSelection1 = {
            columnWidth: 60,
            type: 'checkbox',
            selectedRowKeys: selectedRowKeys11,
            onChange: (selectedRowKeys, selectedRows) => {
                this.setState({
                    selectedRows11: selectedRows,
                    selectedRowKeys11: selectedRowKeys
                }
                )
            }
        }
        const expandedRowRender = () => {
            const { columnsInterior, dataSourceInterior } = this.state
            const rowSelection = {
                type: 'radio',
                selectedRowKeys: selectedRowKeys1,
                onChange: (selectedRowKeys1, selectedRows1) => {
                    const { merge } = this.state
                    let id = null
                    console.log(selectedRows1);
                    selectedRows1.forEach((value, index) => {
                        id = value.detailId
                    })
                    let data = `&id=${id}&isMerge=${merge}`
                    if (id !== null) {
                        this.materialHandoverAcceptDetail(data)
                    }
                    this.setState({
                        selectedRowKeys1: selectedRowKeys1,
                        selectedRows1: selectedRows1
                    })
                },
            }
            return <TableCustomize
                rowSelection={rowSelection}
                columns={columnsInterior}
                rowKey={(record) => record.detailId}
                dataSource={dataSourceInterior}
                pagination={false}
                allowDrafting={true}
                rowClassName={(record, index) => {
                    return (['editable-row', index % 2 === 0 ? 'editable-row' : 'editable-row12'])
                }}
                onRow={(record, index) => ({
                    onClick: this.pitch1.bind(this, record, index)
                })}
                scroll={{ x: true, y: 300 }}
            />;
        }
        const formItemLayout = {
            // 抽屉里面Form。二列的布局比例
            labelCol: {
                span: 6
            },
            wrapperCol: {
                span: 18
            }
        };
        return (
            <div>
                {
                    tabsKey === '1' ? <BasicLayoutSearch>
                        <SearchForm onSearch={this.handleSearch}
                            onClick={this.cz}
                            onClick1={this.advancedss}
                            advanced={advanced}
                        />
                    </BasicLayoutSearch>
                        : tabsKey === '2' ? <BasicLayoutSearch>
                            <SearchForm1 onSearch={this.handleSearch1}
                                onClick={this.cz1}
                                onClick1={this.advancedss1}
                                advanced1={advanced1}
                            />
                        </BasicLayoutSearch>
                            : null
                }
                <BasicLayout
                    versions={versions}
                    search1={search1}
                    paging1={(data) => {
                        this.setState({
                            paging1: data
                        }, () => {
                            // console.log('这是什么', values1);
                            this.search1({ ...values1, ...data })
                        })
                    }}
                    rowSelection={(data) => {
                        this.setState({
                            rowSelections: data
                        })
                    }}
                    name="物料接收-实收"
                    name1='统计分析'
                    icon="table"
                    icon1='area-chart'
                    buttons={
                        tabsKey === '1' ?
                            [
                                <DownLoadButton key={1} onClick={() => this.allStop()} icon='download' />,
                                
                                // <Button key={3} onClick={this.allStop} type="primary" icon='printer'>导出</Button>,
                                // <Button key={6} onClick={this.derive2} type="primary" icon='download'>导出选中</Button>,
                                // <Upload {...propss} key={5}>
                                //     <Button type="primary">
                                //         <Icon type="upload" /> 导入
                                //     </Button>
                                // </Upload>,
                            ]
                            : tabsKey === '2' ? [
                                <DownLoadButton key={1} onClick={() => this.derive3()} icon='download' text='导出选中' />,
                                // <Button key={1} onClick={this.derive3} type="primary" icon='download'>导出选中</Button>,
                            ]
                                : []
                    }
                    tabsKey={(data) => {
                        this.setState({
                            tabsKey: data
                        }, () => { console.log('当前页', this.state.tabsKey); })
                    }}
                >
                    <TableCustomize
                        rowSelection={rowSelection}
                        columns={columns}
                        rowKey={(record) => record.id}
                        dataSource={dataSource}
                        pagination={false}
                        loading={loading}
                        allowDrafting={true}
                        expandRowByClick={true}
                        expandedRowRender={expandedRowRender}
                        rowClassName={(record, index) => {
                            return (['editable-row', index % 2 === 0 ? 'editable-row' : 'editable-row12'])
                        }}
                        // onRow={(record, index) => ({
                        //     onClick: this.onExpand.bind(this, true, record)
                        // })}
                        onExpand={(expanded, record) => this.onExpand(expanded, record)}
                        expandedRowKeys={this.state.row}
                        scroll={{ x: true, y: 600 }}
                    />
                    {
                        selectedRows1[0] !== undefined ?
                            <Tabs
                                tabBarExtraContent={(
                                    <div className='mydiv'>
                                        {[
                                            <Button key={11} type="primary" onClick={() => this.merge()} icon='printer'>相同物料合并展示</Button>,
                                            <Button key={22} type="primary" onClick={() => this.derive()} icon="download">导出批次详情</Button>,
                                        ]}
                                    </div>
                                )}
                                style={{ marginTop: '20px' }}
                                type="card"
                            >
                                <TabPane tab={'领料单接收详细数据'} key="11">
                                    <TableCustomize
                                        rowSelection={rowSelection1}
                                        columns={columnsInterior1}
                                        rowKey={(record) => record.id}
                                        dataSource={dataSourceInterior1}
                                        pagination={false}
                                        allowDrafting={true}
                                        // onRow={(record, index) => ({
                                        //     onClick: this.pitch2.bind(this, record, index)
                                        // })}
                                        scroll={{ x: true, y: 600 }}
                                        rowClassName={(record, index) => {
                                            return (['editable-row', index % 2 === 0 ? 'editable-row' : 'editable-row12'])
                                        }}
                                    />
                                </TabPane>
                            </Tabs>
                            : null
                    }
                    <BasicPagination pageNum={paging.pageNum} pageSize={paging.pageSize} total={paging.total} loadData={this.fetch} />
                </BasicLayout>
                <Modal
                    visible={visible}
                    title={'请输入接收数量'}
                    onOk={this.onHandleOk}
                    onCancel={this.handleCancel}
                    okText="接收"
                    cancelText="取消"
                >
                    <Form>
                        <Row>
                            <Col span={24}>
                                <FormItem  {...formItemLayout} label={'接收数量：'}>
                                    {getFieldDecorator('takeNumber', {
                                        initialValue: this.state.record && this.state.record.handoverNumber,
                                        rules: [
                                            {
                                                required: true,
                                                message: '接收数量不能为空'
                                            }
                                        ],
                                        getValueFromEvent: (event) => {
                                            return event.target.value.replace(/\s+/g, "")
                                        },
                                    })(<Input placeholder='输入接收数量' allowClear maxLength={20} />)}
                                </FormItem>
                            </Col>
                        </Row>
                    </Form>
                </Modal>
                <div id='prints' style={{ display: 'none' }}>
                    <div style={{ textAlign: 'center', margin: '10px 0' }}>
                        <Row style={{ fontSize: 20, fontWeight: 700 }}>{'物料接收'}</Row>
                    </div>
                    <TableCustomize
                        columns={columns1}
                        rowKey={(record) => record.id}
                        dataSource={
                            some === 0 || some === null ? dataSource : selectedRows}
                        pagination={false}
                        scroll={{ x: false }}
                    />
                    <div style={{ width: '100%', textAlign: 'center', marginTop: '20px' }}>
                        <Row style={{}}>第{1}页,共{1}页</Row>
                    </div>
                </div>
            </div>
        )
    }
}
export default Form.create()(withRouter(MaterialAccept));